<template>
  <div class="app-container">
    <div class="searchBox">
      <el-form :inline="true" :model="search" ref="searchForm">
        <el-form-item label="申请人：" prop="applyUserName">
          <el-input v-model="search.applyUserName" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item style="margin-top: -2px">
          <el-button type="primary" @click="searchQuery">查询</el-button>
          <el-button type="info" @click="search = {};searchQuery()">重置</el-button>
        </el-form-item>
      </el-form>
    </div>

    <qm-table
      ref="qmTable"
      v-if="!pageLoading"
      :data="query"
      :showOrder="false"
      :showCheckbox="false"
      :showDelete="false"
      :showView="false"
      menuType="text"
      :showAdd="false"
      :showEdit="false"
      :menuOptions="{ width: 120 }"
    >
      <qm-table-column field="applyUserName">申请人</qm-table-column>
      <qm-table-column field="days">请假天数</qm-table-column>
      <qm-table-column field="leaveType">请假类型</qm-table-column>
      <qm-table-column
        field="status"
        fieldType="enum"
        :enumOptions="controlData.LeaveApplyStatuses"
        width="150px"
      >当前状态</qm-table-column>
      <qm-table-column field="applyTime" width="150px">申请时间</qm-table-column>

      <!-- <template v-slot:form="{ model }">
        <el-row :gutter="12">
          <el-col :span="12">
            <el-form-item label="申请人：" prop="applyUserName">
              <el-input v-model="model.applyUserName" placeholder="请输入内容"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="申请时间：" prop="applyTime">
              <el-date-picker
                v-model="model.applyTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="12">
          <el-col :span="12">
            <el-form-item label="申请天数：" prop="days">
              <el-input v-model="model.days" placeholder="请输入内容"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="假期类型：" prop="leaveType">
              <el-select v-model="model.leaveType">
                <el-option value="事假" label="事假"></el-option>
                <el-option value="年假" label="年假"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="12">
          <el-col :span="24">
            <el-form-item label="请假事由：" prop="reason">
              <el-input type="textarea" v-model="model.reason"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </template>-->

      <template v-slot:toolbar>
        <el-button type="primary" @click="createLeaveApply">发起请假申请流程</el-button>
        <el-button type="primary" @click="createJoinSign">发起会签示例流程</el-button>
      </template>
      <template v-slot:moreBtn="{ row }">
        <!-- <el-button type="text" v-if="row.status === 'draft'" @click="edit(row)">编辑</el-button> -->
        <el-button type="text" @click="processOn(row)">办理</el-button>
      </template>
    </qm-table>
  </div>
</template>

<script>
import Controller from "@/libs/framework/controller";
import request from "@/utils/request";
import _ from "lodash";
export default class Instance extends Controller {
  onBeforeInit() {
    this.urls = {
      query: "/workflow/demoLeaveApply/query",
      model: "/workflow/demoLeaveApply/getListModel",
      entity: "/workflow/demoLeaveApply/getEntity",
    };
  }

  mixin() {
    return {
      data() {
        return {
          workflowParams: {},
        };
      },
      methods: {
        createLeaveApply() {
          let url = `/workflow/demoLeaveApply/create?action=processStart&appCode=LeaveApply&_r=${new Date().getTime()}`;
          this.$root.openModal(url);
        },
        createJoinSign() {
          let url = `/workflow/demoLeaveApply/create?action=processStart&appCode=JoinSign&_r=${new Date().getTime()}`;
          this.$root.openModal(url);
        },
        processOn(row) {
          this.getWorkflowArgs({ formId: row.leaveId }).then((rlt) => {
            let url = "";
            if (rlt.taskId) {
              url = `${rlt.appUrl}?action=processEdit&taskId=${
                rlt.taskId
              }&assigneeId=${rlt.assigneeId}&appCode=${rlt.appCode}&version=${
                rlt.version
              }&_r=${new Date().getTime()}`;
            } else if (rlt.historyTaskId) {
              url = `${rlt.appUrl}?action=processView&historyTaskId=${
                rlt.historyTaskId
              }&appCode=${rlt.appCode}&version=${
                rlt.version
              }&_r=${new Date().getTime()}`;
            } else {
              this.notifyError("无法获取应用的处理地址");
            }
            if (url) {
              this.$root.openModal(url);
            }
          });
        },
      },
      created() {},
    };
  }
}
</script>

<style scoped lang="scss">
.fa-circle {
  font-size: large;
}

.fa-circle.red {
  color: red;
}

.fa-circle.yellow {
  color: orange;
}

.fa-circle.green {
  color: green;
}
</style>

